<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        body {
            text-align: center;
        }

        canvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>

<canvas width="600" height="600"></canvas>

<script>
    var cas=document.querySelector("canvas");
    var ctx=cas.getContext("2d");

    //画一个矩形
    ctx.strokeRect(300,300,100,100);
    //旋转
    ctx.rotate(degToArc(10));
    ctx.strokeRect(300,300,100,100);

    //把角度转为弧度
    function degToArc(num){
        return Math.PI/180*num;
    }


</script>


</body>
</html>